<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="format-detection" content="telphone=no, email=no"/>
<meta name="msapplication-tap-highlight" content="no">
<meta name="screen-orientation" content="portrait">
 
<title>酷星互动聊天</title>
<link href="css/common.css" rel="stylesheet"/>
<link href="css/register.css" rel="stylesheet"/>
<link href="css/icofont.css" rel="stylesheet"/>

<script type="text/javascript">
	function click_a(divDisplay)
        {
            if(document.getElementById(divDisplay).style.display != "block")
            {
                document.getElementById(divDisplay).style.display = "block";
            }
            else
            {
                document.getElementById(divDisplay).style.display = "none";
            }
        }
</script>

</head>

<body class="regbg">
	
    <main class="mui-content">
    	<div class="chatbox">
        	<article class="fragment">
            	<time>09-10 22:00</time>
                <div class="chatleft">  <!-- 左边窗口为使用者之外的人 -->
                    <div class="chatkg">
                    	<div class="chatpic">
                    		<div class="chatuser"><img src="images/user01.jpg"></div>
                            <title>妈妈的爱U</title>
                        </div>
                        <div class="ico-sanj"></div>
                        <div class="chatword">  <!-- 左边为蓝色框 chatword，在chatword上面添加播放语音事件 图标用白色 ico-singal-w -->
                        	<a class="mui-ico ico-singal-w"></a>
                        </div> 
                    </div>
                </div>
                <div class="chatright">  <!-- 右边窗口为使用者 -->
                    <div class="chatkg">
                    	<div class="chatpic2">
                    		<div class="chatuser"><img src="images/user02.jpg"></div>
                            <title>小淘气斯蒂芬发达</title>
                        </div>
                        <div class="ico-sanj2"></div>
                        <div class="chatword2">   <!-- 右边为白色框 chatword2， 图标用蓝色 ico-singal-b  -->
                        	<a class="mui-ico ico-singal-b-d"></a>
                        </div> 
                    </div>	
                </div>
                <div class="chatleft">  <!-- 左边窗口为使用者之外的人 -->
                    <div class="chatkg">
                    	<div class="chatpic">
                    		<div class="chatuser"><img src="images/user01.jpg"></div>
                            <title>妈妈的爱U</title>
                        </div>
                        <div class="ico-sanj"></div>   
                        <div class="chatword">    <!-- 左边为蓝色框 chatword， 图标用白色 ico-singal-w -->
                        	<a class="mui-ico ico-singal-w"></a>
                        </div> 
                    </div>
                </div>
                 <div class="chatleft">  <!-- 左边窗口为使用者之外的人 -->
                    <div class="chatkg">
                    	<div class="chatpic">
                    		<div class="chatuser"><img src="images/user01.jpg"></div>
                            <title>妈妈的爱U</title>
                        </div>
                        <div class="ico-sanj"></div>   
                        <div class="chatword">    <!-- 左边为蓝色框 chatword， 图标用白色 ico-singal-w -->
                        	<a class="mui-ico ico-singal-w-d"></a>
                        </div> 
                    </div>
                </div>
        	</article>
        </div>
    </main>
    
    
     <div class="opennav" id="opennav">
        	<a class="" onClick="">用户中心</a>
        	<a class="" onClick="">系统设置</a>
    </div>
    
    <footer class="mui-bar mui-bar-footer-input">
    	<a class="vocbor">按住说话</a>	<!-- 点击之后显示 "松开之后结束通话" -->
   	</footer>
    
    
    <footer class="mui-bar mui-bar-footer">
    	<a class="ico-yudo mui-pull-left" href="position.html">实时定位</a> <!--当前选中状态为 ico-yudohov -->
        <a class="ico-yudo mui-pull-left" href="tel:18688888888">一键通话</a>
        <a class="ico-yudo mui-pull-left" href="chat.html">互动聊天</a>
        <a class="ico-yudo mui-pull-left" onclick="return click_a('opennav')">更多服务</a>
   	</footer>

</body>
</html>
